<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<div id="talentGrid"></div>
<div id="talentToolbar">
	<div>
		<a href="#" class="easyui-linkbutton" onclick="talent.toolbar.showAddDialog();" data-options="
		iconCls:'icon-add',
		plain:true">
			新增
		</a>
		<a href="#" class="easyui-linkbutton" onclick="talent.toolbar.showUpdateDialog();" data-options="
		iconCls:'icon-edit',
		plain:true">
			修改
		</a>
		<a href="#" class="easyui-linkbutton" onclick="talent.toolbar.remove();" data-options="
		iconCls:'icon-remove',
		plain:true">
			删除
		</a>
		<a href="#" class="easyui-linkbutton" onclick="talent.toolbar.redo();" data-options="
		iconCls:'icon-redo',
		plain:true">
			取消
		</a>
	</div>
	<div>
		<strong>姓名：</strong>
		<input type="text" name="name"/>
		<strong>时间：</strong>
		<input type="text" name="time" class="easyui-datetimebox"/>
		<a href="#" class="easyui-linkbutton" data-options="
		iconCls:'icon-search',
		plain:true">
			查询
		</a>
	</div>
</div>

<div id="talentAddDialog" class="easyui-dialog talent-add" data-options="
title:'新增用户',
buttons:'#talentAddButtons',
closed: true,
onClose:talent.toolbar.resetAddFrom">
	<form id="talentAddForm" method="post">
		<p>
			<strong>帐号：</strong>
			<input type="text" name="code" id="code" class="easyui-validatebox" data-options="
			required:true">
		</p>
		<p>
			<strong>密码：</strong>
			<input type="password" name="password" class="easyui-validatebox" data-options="
			required:true">
		</p>
		<p>
			<strong>姓名：</strong>
			<input type="text" name="name" class="easyui-validatebox" data-options="
			required:true">
		</p>
		<p>
			<strong>电话：</strong>
			<input type="text" name="phone" class="easyui-validatebox" data-options="
			required:true">
		</p>
		<p>
			<strong>邮箱：</strong>
			<input type="text" name="email" class="easyui-validatebox" data-options="
			required:true">
		</p>
		<p>
			<strong>年龄：</strong>
			<input type="text" name="age" id="age" class="easyui-numberspinner" data-options="
			min: 18,
			max: 60,
			editable: false">
		</p>
		<p>
			<strong>性别：</strong>
			<select class="easyui-combobox" name="gender" id="gender">
			    <option value="1">男</option>
			    <option value="2">女</option>
			</select>
		</p>
		<p>
			<strong>菜单：</strong>
			<input type="text" id="menu">
		</p>
	</form>
</div>
<div id="talentAddButtons">
	<a href="#" onclick="talent.toolbar.add()" class="easyui-linkbutton" data-options="
	iconCls: 'icon-add',
	plain: true">
		新增
	</a>
	<a href="#" onclick="talent.toolbar.hiddenAddDialog();" class="easyui-linkbutton" data-options="
	iconCls: 'icon-redo',
	plain: true">
		取消
	</a>
</div>

<div id="talentUpdateDialog" class="easyui-dialog talent-add" data-options="
title: '新增用户',
buttons: '#talentUpdateButtons',
closed: true,
onClose: talent.toolbar.resetUpdateFrom">
	<form id="talentUpdateForm" method="post">
		<input type="hidden" name="id"/>
		<p>
			<strong>帐号：</strong>
			<input type="text" name="code" readonly="readonly" class="easyui-validatebox" data-options="
			required: true">
		</p>
		<p>
			<strong>姓名：</strong>
			<input type="text" name="name" class="easyui-validatebox" data-options="
			required: true">
		</p>
		<p>
			<strong>电话：</strong>
			<input type="text" name="phone" class="easyui-validatebox" data-options="
			required: true">
		</p>
		<p>
			<strong>邮箱：</strong>
			<input type="text" name="email" class="easyui-validatebox" data-options="
			required: true">
		</p>
		<p>
			<strong>年龄：</strong>
			<input type="text" name="age" class="easyui-numberspinner" data-options="
			min: 18,
			max: 60,
			editable: false">
		</p>
		<p>
			<strong>性别：</strong>
			<select name="gender" class="easyui-combobox">
			    <option value="1">男</option>
			    <option value="2">女</option>
			</select>
		</p>
		<p>
			<strong>菜单：</strong>
			<input type="text" id="menuUpdate">
		</p>
	</form>
</div>
<div id="talentUpdateButtons">
	<a href="#" onclick="talent.toolbar.update()" class="easyui-linkbutton" data-options="
	iconCls: 'icon-edit',
	plain: true">
		修改
	</a>
	<a href="#" onclick="talent.toolbar.hiddenUpdateDialog();" class="easyui-linkbutton" data-options="
	iconCls: 'icon-redo',
	plain: true">
		取消
	</a>
</div>

<script>	
	var talent = {
		init : function() {
			talent.talentGrid = $('#talentGrid');
			talent.menu = $('#menu');
			talent.talentAddDialog = $('#talentAddDialog');
			talent.code = $('#code');
			talent.age = $('#age');
			talent.talentAddForm = $('#talentAddForm');
			talent.talentUpdateForm = $('#talentUpdateForm');
			talent.menuUpdate = $('#menuUpdate');
			talent.talentUpdateDialog = $('#talentUpdateDialog');
			
			talent.talentGrid.datagrid({
			    url: '<%=request.getContextPath()%>/TestServlet?command=listTalent',
			    fitColumns: true,
			    striped: true,
			    rownumbers: true,
			    pagination: true,
			    pageSize: 20,
			    pageList: [10, 20, 30, 40, 50],
			    pageNumber: 1,
			    sortName: 'age',
			    sortOrder: 'desc',
			    toolbar: '#talentToolbar',
			    columns:[[
					{field:'id', width:100, checkbox: true},
					{field:'name', title:'姓名', width:100, align:'center'},
					{field:'age', title:'年龄', width:100, align:'center', sortable: true},
					{field:'phone', title:'电话', width:100, align:'center'},
					{field:'email', title:'邮箱', width:100, align:'center'}
			    ]],
				onDblClickRow: function(rowIndex, rowData) {
					talent.toolbar.showUpdateDialog(rowData.id);
				}
			});
		},
		toolbar: {
			showCombotree: function() {
				talent.menu.combotree({
					url: '<%=request.getContextPath()%>/TestServlet?command=listMenu',
					lines: true,
					multiple: true,
					checkbox: true,
					onlyLeafCheck: true,
					onLoadSuccess: function(node, data) {
						$(this).tree('expandAll')
					}
				});
			},
			showAddDialog: function() {
				talent.toolbar.showCombotree();
				talent.talentAddDialog.dialog('open');
				talent.code.focus();
				// 坑，只能使用id选择器
				talent.age.numberspinner('setValue', 20);
			},
			hiddenAddDialog: function() {
				talent.talentAddDialog.dialog('close');
				talent.toolbar.resetAddForm();
			},
			resetAddForm: function() {
				talent.talentAddForm.form('reset');
			},
			add: function() {
				if (talent.talentAddForm.form('validate')) {
					$.messager.progress({
						text : '正在处理...'
					});
					$.post('<%=request.getContextPath()%>/TestServlet?command=addTalent', talent.talentAddForm.serialize(), function(data) {
						if (data) {
							$.messager.show({
								title: '系统提示',
								msg: '新增成功！',
								timeout: 3000,
								showType: 'slide'
							});
							talent.toolbar.resetAddFrom();
							talent.talentGrid.datagrid('reload');
						} else {
							$.messager.alert('系统提示', '新增失败！', 'error')
						}
						$.messager.progress('close');
						talent.toolbar.hiddenAddDialog();
					});
				}
			},
			showUpdateDialog: function(id) {
				talent.toolbar.showCombotree();
				var getData = function(v) {
					$.messager.progress({
						text : '正在处理...'
					});
					$.post('<%=request.getContextPath()%>/TestServlet?command=getTalent', {id : v}, function(data) {
						if (data) {
							talent.talentUpdateForm.form('load', {
								id: data.id,
								code: data.code,
								name: data.name,
								phone: data.phone,
								email: data.email,
								age: data.age,
								gender: data.gender
							});
							// 测试默认选中管理员管理,求职者管理
							var checkedItems = '管理员管理,求职者管理'.split(',');
							talent.menuUpdate.combotree({
								url: '<%=request.getContextPath()%>/TestServlet?command=listMenu',
								lines: true,
								multiple: true,
								checkbox: true,
								onlyLeafCheck: true,
								onLoadSuccess: function(node, data) {
									var that = this;
									$(that).tree('expandAll')
									if (data) {
										$(data).each(function(index, value) {
											if ($.inArray(value.text, checkedItems) != -1) {
												$(that).tree('check', value.target);
											}
										});
									}
								}
							});
							$('#talentUpdateDialog').dialog('open');
						} else {
							$.messager.alert('系统提示', '获取信息失败！', 'error')
						}
						$.messager.progress('close');
					}, 'json');
				}
				if (id) {
					getData(id);
				} else {
					var row = talent.talentGrid.datagrid('getSelections');
					if (row.length == 1) {
						getData(row[0].id);
					} else {
						$.messager.show({
							title: '系统提示',
							msg: '请选择一行数据进行修改！',
							timeout: 3000,
							showType: 'slide'
						});	
					}
				}
			},
			hiddenUpdateDialog: function() {
				$('#talentUpdateDialog').dialog('close');
				talent.toolbar.resetUpdateFrom();
			},
			resetUpdateFrom: function() {
				talent.talentUpdateForm.form('reset');
			},
			update: function() {
				if (talent.talentUpdateForm.form('validate')) {
					$.messager.progress({
						text : '正在处理...'
					});
					$.post('<%=request.getContextPath()%>/TestServlet?command=updateTalent', $("#talentUpdateForm").serialize(), function(data) {
						if (data == 1) {
							$.messager.show({
								title: '系统提示',
								msg: '修改成功！',
								timeout: 3000,
								showType: 'slide'
							});
							talent.toolbar.resetUpdateFrom();
							talent.talentGrid.datagrid('reload');
						} else {
							$.messager.alert('系统提示', '修改失败！', 'error');
						}
						$.messager.progress('close');
						talent.toolbar.hiddenUpdateDialog();
					});
				}
			},
			remove: function() {
				var row = talent.talentGrid.datagrid('getSelections');
				if (row.length > 0) {
					var ids = [];
					$.each(row, function(i, v) {
						ids.push(v.id);
					});
					$.post('<%=request.getContextPath()%>/TestServlet?command=deleteTalent', {ids: ids.join(',')}, function(data) {
						if (data == 1) {
							$.messager.show({
								title: '系统提示',
								msg: '删除成功！',
								timeout: 3000,
								showType: 'slide'
							});
							talent.talentGrid.datagrid('reload');
						} else {
							$.messager.alert('系统提示', '删除失败！', 'error')
						}
						$.messager.progress('close');
					});
				} else {
					$.messager.show({
						title: '系统提示',
						msg: '请选择数据进行删除！',
						timeout: 3000,
						showType: 'slide'
					});	
				}
			},
			redo: function() {
				talent.talentGrid.datagrid('unselectAll');
			}
		}
	};
	
	$(function(){
		talent.init();
	});
</script>